@charset "utf-8";

/* base */
body,a{color: #333;}
.container .position p{border-bottom-color: #1b67b3;}
.page .pcurrent a,
.page a:hover{border-color: #1b67b3;color:#1b67b3;}
a:hover,
.container .position p span,
.foot-button em,
.foot-button i,
.foot-button a:hover span,
.foot-button a.active span{color: #1b67b3;}
.navico.nav_open span{background: #fff;}
.online_box p,
.online_box p span,
.navico span,
.navico span::before,
.navico span::after,
.swiper-pagination-bullets .swiper-pagination-bullet-active{background-color: #1b67b3;}
.online_box p:hover,
.online_box p:hover span{background: #0daeff;}

@media only screen and (max-width:1024px){
.w1920 .swiper-pagination-bullet{padding: 3px;margin: 0 7px;}
.w1920 .swiper-pagination-bullet-active{padding: 2px;}
}
@media only screen and (max-width:425px){
.w1920 .swiper-pagination-bullet{margin: 0 4px;}
}


/* top */
.topbox{height: 40px;background: #f5f5f5;line-height: 40px;color: #666;border-bottom: 1px solid #f0f0f0;overflow: hidden;}

@media only screen and (max-width:1024px){
.topbox{display: none;}
}

/* headbox */
.headbox{width: 100%;height: 120px;}
.headbox .w1440{height: 100%;}
.headbox .logo{height:100%;overflow: hidden;float: left;}
.headbox .logo a{display: block;position: relative;padding-left: 190px;height: 100%;line-height: 1;}
.headbox .logo p{position: absolute;left: 0;top: 0;height: 100%;padding: 5px 0;}
.headbox .logo p img{max-height: 100%;position: relative;top: 50%;margin-top: -30px;}
.headbox .logo strong{display: block;font-size: 34px;color: #1b67b2;padding: 35px 0 6px;}
.headbox .logo span{display: block;font-size: 15px;text-transform: uppercase;color: #333;letter-spacing: 1px;}
.headbox .logo em{display: none;font-size: 30px;padding: 15px 0;font-weight: 600;color: #1b67b2;font-style: normal;}

.headbox .tel{float: right;height: 100%;padding-left: 60px;position: relative;}
.headbox .tel em{width: 50px;height: 50px;position: absolute;left: 0;bottom: 25px;border: 2px solid #1b67b2;text-align: center;line-height: 46px;font-size: 30px;color: #1b67b2;border-radius: 25px;}
.headbox .tel em svg{height: 46px;}
.headbox .tel span{display: block;padding: 18px 0 2px 1px;color: #808080;line-height: 20px;}
.headbox .tel p{font-size: 30px;font-weight: 600;color: #1b67b2;line-height: 30px;}

@media only screen and (max-width:1200px){
.headbox .logo a{padding-left: 180px;}
.headbox .logo strong{font-size: 32px;}
.headbox .logo span{letter-spacing: .4px;}
}
@media only screen and (max-width:1024px){
.headbox{height: 60px;position: fixed;z-index: 9999999;box-shadow: 0 2px 10px rgba(0,0,0,.2);background: #fff;}
.headbox .w1440{width: 100%;}
.headbox .logo{padding-left: 1%;}
.headbox .logo a{padding-left: 150px;}
.headbox .logo p img{position: relative;top: 0;margin: 0;}
.headbox .logo em{display: block;}
.headbox .tel,
.headbox .logo strong,
.headbox .logo span{display: none;}
}
@media only screen and (max-width:768px){
.headbox{height: 50px;}
.headbox .logo a{padding-left: 120px;}
.headbox .logo em{padding: 11px 0;font-size: 28px;}
}

/* nav */
.navbox{height: 50px;background: #1b67b2;position: absolute;left: 0;top: 160px;box-shadow: 0 2px 10px rgba(0,0,0,.2);z-index: 999999;}
.navbox ul li a{width: 100%;line-height: 30px;display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;position: relative;z-index: 1;color: #fff;}

@media only screen and (min-width:1025px){
.navbox ul{display: flex;flex-wrap: nowrap;height: 100%;}
.navbox ul li{float: left;text-align: center;position: relative;width: 11.5%;flex-shrink: 0;}
.navbox ul li > a{font-size: 15px;font-weight: 600;padding: 10px 5px;}
.navbox ul li dl{width: 100%;position: absolute;left: 0;top: 100%;opacity: 0;z-index: 2;}
.navbox ul li[t="products"] dl{width: 150px;left: 50%;margin-left: -75px;}
.navbox ul li dl a{height: 0;padding: 0 5px;line-height: 40px;background: #1b67b2;}
.navbox ul li dl a:hover{background: #0daeff;font-weight: 600;}
.navbox ul li dl em{display: block;position: absolute;width: 100%;height: 0;overflow: hidden;left: 0;bottom: 100%;color: #fff;}

.navbox ul li:hover dl{opacity: 1;box-shadow: 0 2px 6px rgba(0,0,0,.2);}
.navbox ul li:hover dl::before{height: 15px;}
.navbox ul li:hover dl a{height: 40px;margin-top: 1px;}
.navbox ul li:hover dl em{height: 10px;}
.navbox ul li.active > a{background: #0daeff;}
}
@media only screen and (min-width:1200px){
.navbox ul li[t="products"] dl{width: 100%;left: 0;margin: 0;}
}
@media only screen and (max-width:1024px){
.navbox{width: 100%;height: 0;overflow: hidden;position:fixed;top:0;background:#333;}
.navbox.nav_on{height:100%;}
.navbox ul{width:100%;height:calc(100vh - 130px);overflow-y:auto;position:absolute;left:0;top:70px;padding:0 3%;}
.navbox ul li{width:100%;border-bottom:1px solid #555;padding: 0;position: relative;z-index: 5;-webkit-transition: .5s;transition: .5s;}
.navbox ul li a{display: block;width: 100%;color: #fff;overflow: hidden;position: relative;z-index: 1;font-weight: 600;}
.navbox ul li > a{line-height: 50px;padding: 0 10px;font-size: 14px;}
.navbox ul li > a em{font-style: normal;padding-right: 10px;}
.navbox ul li.active,
.navbox ul li:hover{z-index: 6;}
.navbox ul li.active > a{color: #0daeff;}

.navbox ul li dl{width: 100%;position: absolute;left: 0;top: 100%;background: #0daeff;z-index: 2;}
.navbox ul li dl span{display: block;width: 50px;height: 50px;position: absolute;top: -50px;right: 0;text-align: center;line-height: 50px;color: #ccc;font-size: 16px;z-index: 0;-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.navbox ul li dl span svg{height: 50px;line-height: 50px;}
.navbox ul li dl a{display: block;width: 100%;line-height: 40px;height: 0;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;color: #fff;font-size: 14px;background: #158fca;padding: 0 15px;}
.navbox ul li dl a:hover{background: #ffbf00;}
.navbox ul li.dl_show{z-index: 10;}
.navbox ul li.dl_show dl a{height: 40px;margin-bottom: 1px;}
.navbox ul li.dl_show dl span{-webkit-transform: rotateZ(-180deg);-moz-transform: rotateZ(-180deg);transform: rotateZ(-180deg);}
}
@media only screen and (max-width:768px){
.navbox ul{height:calc(100vh - 120px);top:60px;}
}

/*banner*/
.banner{padding-top: 50px;}
.bannerpic{height: 0;padding-bottom: 450px;}

#shutter .btn p{background: rgba(0,0,0,.3);}
#shutter .btn p:hover{background: rgba(15,175,255,.7);}

@media only screen and (max-width:1440px){
.bannerpic{padding-bottom:31.25%;}
}
@media only screen and (max-width:1200px){
.bannerpic{padding-bottom:33%;}
}

/* search */
.searchbox{padding: 22px 0;background: #f5f5f5;}
.searchbox .txt{width: 65%;float: left;padding-left: 90px;position: relative;line-height: 36px;overflow: hidden;height: 36px;}
.searchbox .txt .tit{position: absolute;left: 0;top: 0;background: #f5f5f5;font-weight: 600;}
.searchbox .txt p{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

.searchbox .search{width: 33%;float: right;overflow: hidden;position: relative;max-width: 360px;}
.searchbox .search p{width: 100%;background: #fff;border: 1px solid #1b67b2;border-radius: 18px;overflow: hidden;}
.searchbox .search p input{line-height: 20px;padding: 7px 14px;overflow: hidden;display: block;width: 100%;}
.searchbox .search em{display: block;width: 70px;position: absolute;right: 0;top: 0;background: #1b67b2;border-radius: 18px;height: 100%;}
.searchbox .search em input{display: block;width: 100%;height: 100%;background: url(../images/icon1.png) center no-repeat;cursor: pointer;}

@media only screen and (max-width:1200px){
.searchbox{padding: 17px 0;}
}
@media only screen and (max-width:1024px){
.searchbox{padding-bottom: 15px;}
.searchbox .txt{width: 100%;height: 34px;padding-top: 5px;}
.searchbox .txt .tit{top: 5px;}
.searchbox .txt p{overflow-x: auto;text-overflow: unset;}
.searchbox .search{width: 100%;max-width: 100%;}
.searchbox .search em{width: 80px;}
}
@media only screen and (max-width:480px){
.searchbox .search em{width: 70px;}
}
@media only screen and (max-width:425px){
.searchbox .search em{width: 65px;}
}

/* foot */
.footbox{background:#2d2d2d;color: rgba(255,255,255,.5);line-height: 30px;border-top: #999;}
.footbox a{color: rgba(255,255,255,.5);}
.footbox a:hover{color: #fff;}

.footbox .footcon{padding: 50px 0;border-bottom: 1px solid #444;}
.footbox .footcon .titl{width: 100%;margin-bottom: 20px;line-height: 1.5;}
.footbox .footcon .titl p{font-size: 16px;font-weight: 600;color: #fff;}
.footbox .footcon .titl span{text-transform: uppercase;}
.footbox .footcon .list{width: 100%;overflow: hidden;}
.footbox .footcon .list a{display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

.footbox .footcon .txt{width: 20%;float: left;flex-shrink: 0;padding: 0 3% 0 3.5%;border-left: 1px solid #444;}

.footbox .footcon .txt.txt1{width: 11%;padding-left: 0;border: none;}
.footbox .footcon .txt2{width: 32%;}
.footbox .footcon .txt2 .list p{width: 50%;padding-right: 5px;float: left;}
.footbox .footcon .txt3{width: 16%;}
.footbox .footcon .txt.txt4{width: 27%;padding-right: 1%;}
.footbox .footcon .txt.ewm{width: 14%;padding: 0;border: none;text-align: center;}
.footbox .footcon .ewm p{width: 100%;max-width: 180px;padding: 14px 14px 4px;border: 1px solid #444;float: right;}
.footbox .footcon .ewm p img{max-width: 100%;}
.footbox .footcon .ewm p span{display: block;padding-top: 5px;color: #fff;}

.footbox .linkbox{border-bottom: 1px solid #444;padding: 19px 0 19px 155px;position: relative;}
.footbox .linkbox .titl{width: 150px;position: absolute;left: 2px;top: 19px;font-size: 18px;}
.footbox .linkbox .titl p{color: #fff;float: left;}
.footbox .linkbox .titl span{text-transform: uppercase;padding: 2px 10px;float: left;}

.footbox .linkbox ul{width: 100%;overflow: hidden;min-height: 30px;}
.footbox .linkbox ul li{display: inline;padding: 0 5px;}
.footbox .linkbox ul li a{white-space: nowrap;}

.footbox .bottom{padding: 25px 0 30px;text-align: center;line-height: 25px;}
.footbox .bottom p{display: inline;padding: 0 2px;}
.footbox .bottom .txt{display: none;}

@media only screen and (max-width:1200px){
.footbox .footcon .txt{padding: 0 1.5% 0 2.5%;}
.footbox .footcon .txt3{width: 15%;}
.footbox .footcon .txt.txt4{width: 28%;}
.footbox .footcon .ewm p{padding: 9px 9px 4px;max-width: 170px;}
}
@media only screen and (max-width:1024px){
.footbox .footcon,
.footbox .linkbox{display: none;}
.footbox .bottom{padding: 20px 0 15px;}
.footbox .bottom .txt{display: inline;}
}
@media only screen and (max-width:768px){
.footbox .bottom{padding: 15px 0 10px;}
}